/* 清除默认样式 */
*{padding: 0;margin: 0;}

/* 由外向内写样式 自适应*/
.g-container{
    width: 100%;
    height: 100vh;

    display: flex;
    /* 改变主轴方向为垂直方向  */
    flex-direction: column;
}

/* 搜索区域 */
.g-container .g-search{
    height: 50px;
    background-color: red;

    display: flex;
    align-items: center;
}
.g-container .g-search h2{
    font-size: 16px;
    color: white;
    width: 50px;
    text-align: center;
}
.g-container .g-search input{
    flex-grow: 1;
    height: 25px;
    border: none;
    outline: none;
    border-radius: 5px;
    text-indent: 8px;
}

/* 底部区域 */
.g-container .g-footer{
    height: 70px;
    background-color: white;

    display: flex;
    justify-content: space-around;
    align-items: center;
}
.g-container .g-footer .active{
    color: red;
}


/* 中间滚动区域 */
.g-container .g-wrapper{
    flex-grow: 1;
    overflow: scroll;
}

/* 轮播区域 */
.g-container .g-wrapper .g-swipper{
    height: 200px;
    width: 100%;
    background-color: aqua;
}

.g-container .g-wrapper .g-swipper img{
    width: 100%;
    height: 200px;
}



/* 商品分类区域 */
.g-container .g-wrapper .g-category{
    height: 200px;
    width: 100%;
    background-color: aquamarine;
}

/* 商品列表 */
.g-container .g-wrapper .g-goods{
    width: 100%;
    height: 400px;
    background-color: goldenrod;
}
